Con Explorer esta idea de mostrar los vídeos en ventana modal con Lytebox no funciona, sin embargo con Firefox el resultado es genial.
Ahí quedan las explicaciones por si son útiles en algún momento
Son varias las preguntas sobre la forma de presentar los vídeos.
Utilizo Lytebox un script que nos permite mostrar contenido en ventana modal. No es necesario añadir otros scripts y ese es el principal motivo por el que resulta más rápida la carga del blog.
Sus funciones parecen muy básicas y en realidad lo son, lo podemos usar en cualquier enlace, imagen, grupos de imágenes, slideshow, incluso añadir un iframe.La imposibilidad de mostrar vídeos es el punto negativo de Lytebox.
Con esa limitación y todo decidí añadir Lytebox y después con más calma averiguar la forma de mostrar vídeos aunque poco había que averiguar porque leyendo atentamente mi propia entrada llegué al punto donde decía "La posibilidad de añadir un iframe con la etiqueta rel="lyteframe" resulta muy útil cuando tratamos de mostrar una página si necesidad de salir del blog" pensé que si se puede mostrar página s también podía mostrarse vídeos.
Para añadir un iframe lo haríamos así:
<a href="iframe-único" rel="lyteframe" title="Título">texto o imagen</a>
Para escoger el tamaño que mostrará el vídeo le añadimos ancho y alto:
<a href="iframe-único" rel="lyteframe" title="Título"rev="width: 400px; height: 300px; scrolling: no;">texto o imagen</a>
En title añadimos el texto que aparece en la parte inferior a modo de título.
» Con width añadimos anchura y con height altura.
» Donde "texto o imagen" es el sitio donde añadimos la imagen que se muestra en caso de no desear texto.
» Añadimos una imagen con <img src="url-de-la-imagen">
Lo siguiente sería la url del vídeo que vamos a mostrar, en este caso lo que haremos será obtener el código del vídeo que You Tube nos proporciona algo así:
<object width="320" height="265"><param name="movie" value="http://www.youtube.com/v/wRKPcx9Cpe8&hl=es&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/wRKPcx9Cpe8&hl=es&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="320" height="265"></embed></object>
De todo ese código lo único que vamos a necesitar es lo marcado en negrita.
http://www.youtube.com/v/wRKPcx9Cpe8
Quedaría algo así:
<a href="http://www.youtube.com/v/wRKPcx9Cpe8" rel="lyteframe" title="Título"rev="width: 400px; height: 300px; scrolling: no;">texto o imagen</a>
Y lo veríamos así:
Si en lugar de texto deseamos una imagen sustituimos el texto por <img src="url-de-la-imagen"> puede ser cualquier imagen pero yo quería lo más parecido a un vídeo. La única solución que encontré es la siguiente...
En un blog de pruebas añadimos el código del vídeo, una vez lo visualizamos en el blog hacemos una captura y esa será la imagen que mostraremos.
Imagen
Subimos esa imagen a Blogger, copiamos la url y la añadimos sustituyendo el texto de "texto o imagen" puede parecer demasiado laborioso pero el único paso que requiere mostrar el vídeo con este aspecto es la captura para conseguir la imagen.
Si no deseamos hacer captura lo podemos hacer con cualquier otra imagen que tengamos en nuestro PC.
Ejemplo con captura
Recién sacada del horno tenemos una opción más, es una aportación de J.Miur y sugiere obtener 4 posibles imágenes con la misma url del vídeo, ahorrando de esta forma tomar una captura.
http://www.youtube.com/v/wRKPcx9Cpe8
http://img.youtube.com/vi/wRKPcx9Cpe8/0.jpg
300x240
http://img.youtube.com/vi/wRKPcx9Cpe8/1.jpg
125x100
http://img.youtube.com/vi/wRKPcx9Cpe8/2.jpg
125x100
http://img.youtube.com/vi/wRKPcx9Cpe8/3.jpg
125x100
<a href="http://www.youtube.com/v/wRKPcx9Cpe8" rel="lyteframe" title="Título"rev="width: 300px; height: 240px; scrolling: no;"><img src="http://img.youtube.com/vi/wRKPcx9Cpe8/0.jpg" /></a>
Llevaba un tiempo buscadolo para mi blog de humor, me pondre manos a la obra.
Un abrazo
:D o mi mae querida, qué buena idea, he tardado un rato en captarla (mis radares están medio desgastados solo por hoy)...muy bueno Gema...besitos
Muy bueno el post, Gem@, sacando de donde no hay. Yo hasta ahora lo había hecho en plan casero, enlazando una captura del vídeo, tal y como muestras tú aquí, con la página de youtube,pero sin que se me abriera en pantalla completa. Ahora, ya sé como hacerlo mejor. Gracias, guapa.
Genial Gem@, me gustó mucho el efecto, creo que lo aplicaré ;)
Cada vez que me he encontrado esa forma de publicar un vídeo me he preguntado cómo lo hacían y, mira por donde, como no podía ser de otra manera, tú me lo pones en bandeja.
Aunque debo dar por sentado que antes de llevar a cabo lo que en este post explicas se ha de aplicar lo que en la entrada sobre el tema de las presentaciones "añadir Lytebox" explicabas, verdad?.
Te lo pregunto por que no vaya a ser que no y le ande dando vueltas y revueltas jajaja, ya me conoces.
Un beso.
yz Hola Sisco te recomiendo Lytebox si lo que buscas es una ventana modal, es la más liviana que he visto hasta ahora y aunque parezca muy laborioso todo esto que explico no lo es en absoluto :)
yz Besitos Graciela que tengas un buen día :)
(aquí ya noche)
yz Hola Jose, un enlace directo a la página es mucho más práctico, es cuestión de gustos añadir una ventana modal :)
Tengo en cuenta tu plantilla, voy a solucionar dos que tengo atrasadas así no dejo la tuya a medias ;)
yz Me alegra que te guste Jaime :)
yz Hola Susy estás en lo cierto, esta entrada sólo trata de orientar si deseamos añadir vídeos con Lytebox, pero es necesario antes añadir el script y los estilos de a ventana a la plantilla.
Si lo vas a probar espera un par de días que voy a actualizar la otra entrada para que no sea necesario alojar el script en un servicio externo ;)
yz Escribíamos al mismo tiempo Miguel Angel ¡que bien que te sea tan útil!! :)
Vale Gem@,
como ves estaba pendiente de tu contestación así que esperaré y seguiré tus instrucciones.
Venga, buenas noches y un fuerte abrazo:)
yz Ya veo Susy, te mantendré informada :)
Hola,
me gustaría invitarte a formar parte de La Faviconera, un directorio de 16x16 que he creado para la promoción de los blogs, te dejo la url para que, si te apetece, unirte.
lafaviconera.blogspot.com
Un saludo y gracias.
yz Gracias por la invitación Miguel Angel :)
Es cierto que hay mucho por aprender, y no creas que hay fecha para terminar porque cuando creas que está listo verás algo que te gusta más.
Mantener un blog es muy gratificante siempre que se tenga ilusión por ello, espero que la tuya dure mucho tiempo ;)
yz Gracias Raúl Montero muy amable :)
Hola gemma!! tu blog es maravilloso pero tengo varios problemas con el mio a ver si me los pudieses resolver jeje...
1ºQuiero poner un fondo en mi blog como el k tu tienes por ejemplo, encontre una pagina
http://www.thecutestblogontheblock.com/free-backgrounds/free-backgrounds/item/706/asInline
el problema...esta en ingles y medio la entiendo pero no se donde tengo que colocar el codigo...podrias explicarmelo EN ESPAÑOl jeje O DECIRME alguna otra pagina similar??
2º tb tengo problemas para poder instalar el bloqueo del boton derecho...no encuentro donde tengo que colocar el codigo.
SOY MUY PATOSA Y ME ENCANTARIA Q ME RESOLVIERAS ESTAS DUDAS Q ESTAR HARTA DE DE LEER PERO LO SIENTO.UN SALUDO Y MARAVILLO BLOG DE VERDAD GRACIAS!!
yz Hola Coral has tenido suerte porque aquí hablamos español y clarito :)
Ese tipo de fondo se añade en cualquier gadget, vas a plantilla de diseño y editas un nuevo gadget escogiendo HTML.... en su interior pegas el código que proporciona donde dice: "Copy & Paste This Code:"
Para inhabilitar el botón derecho mira aquí ;)
Suerte!!
Una pregunta tonta.. tengo blogger.. ¿como instalo el script??? :( no tengo ni idea 11
Hola otra vez, Gem@. Ya he puesto en práctica lo de Lytebox y funciona muy bien, aunque me pasa una cosa muy rara. Verás, cuando entré por primera vez a ver el vídeo de "Construyendo mundos por amor", se me abrió directamente a pantalla completa y en la pestaña ponía l.swf . Al hacer yo una prueba, se me abre siempre en la ventana modal y al ir a comprobarlo en el tuyo, resulta que a veces se me abre la ventana modal y otras, a pantalla completa. ¿Toy loco o qué?No sé qué pasa, la verdad. O...¿es que lo puedes elegir tú? En fin, espero que me ilumines un poquito. Besitos. Y mi plantilla, sin prisas.
Gem@, si me lo permites, me gustaría contestar a Formador Ocupacional con su duda. Mira, arriba, en el tercer o cuarto párrafo, resaltado en rojo dice: "añadir lytebox". Es un enlace que te lleva al post donde Gem@ te explica paso a paso cómo descargar los script y dónde colocarlos en la plantilla para usar Lytebox. Si la duda persiste, no dudes en volver a preguntar.
Jeje.No ha quedado mal,¿no? Gracias Gem@.(Y perdón por la intromisión).
Hola Gema, tengo un pequeño problema y es que cuando se abre la ventana modal, no me aparece como en tu caso el icono (la cruz) para cerrar la ventana en la parte inferior derecha, ¿cómo puedo añadirlo?
Muchísimas gracias de antemano
yz Formador Ocupacional ninguna pregunta es tonta si tiene respuesta :)
Como bien indica Jose hay un enlace en "añadir Lytebox" que te lleva a la entrada donde está incluido el script ;)
yz Hola Jose tienes todo el permiso del mundo para colaborar, es más se agradece muchísimo :)
Sobre el problema que me comentas no estás loco, me di cuenta de ese detalle hace unos días cuando me preguntaron la forma de ver el vídeo a pantalla completa, la respuesta hasta ahora es que cuando la página no ha terminado de cargar si hacemos click sobre el vídeo se muestra a pantalla completa mientras que si lo hacemos con la página cargada se muestra en la medida establecida :)
¿No estaremos volviendo turuletas?
yz Inés en el archivo CSS viene por defecto una imagen de "cerrar" que yo la sustituí por esa que ves, puedes hacer lo mismo y sustituir las imágenes de los estilos por otras tuyas.
Si te gusta la que yo tengo puedes hacer lo siguiente:
Busca en el archivo CSS donde dice:
#lbClose.grey ... más código.
Y esa línea la sustituyes por esta:
#lbClose.grey { background: url(http://1.bp.blogspot.com/_q4j3j-JA2ro/SdaEc8-lCII/AAAAAAAAJ34/sNTPDECEq50/s320/closebox.png) no-repeat; }
¡Este blog es un hallazgo!.Gracias por la paciencia que muestras. Sigo puliendo mi "engendro".¿Se puede eliminar el cuadrito con destornillador-llave que aparece cada vez que incorporas un accesorio?. Me parece que no tiene nada que ver con la plantilla, sino con la forma de trabajar de Blogger.Un beso.N.
yz así es Nuria nada tiene que ver con la plantilla y si con facilitarte trabajo.
Esos iconos llamados de edición rápida sólo los ve el autor del blog cuando está logueado.
Nos permiten acceder a un gadget o las entradas en caso de tener que modificar algo sin necesidad de retroceder a la plantilla de diseño.
Puedes hacer dos cosas eliminarlo definitivamente o desactivarlo, esta última es la más práctica y sencilla porque lo puedes activar cuando tu decidas.
Ve a Configuración | Básico y marca NO en ¿Mostrar Edición rápida en tu blog? con eso ya no lo verás ;)
Nota: solo los miembros de este blog pueden publicar comentarios.